<!DOCTYPE html>
<html>
<head>
    <title>API测试</title>
</head>
<body>
    <h2>API连接测试</h2>
    <button onclick="testAPI()">测试API连接</button>
    <div id="result"></div>
    
    <script>
    function testAPI() {
        fetch('http://localhost:8080/api/register', {
            method: 'POST',
            headers: {'Content-Type': 'application/json'},
            body: JSON.stringify({
                role: 'student',
                username: 'test123',
                name: '测试用户',
                gender: '男',
                password: '123456',
                confirm: '123456',
                grade: '2024',
                class_name: '测试班'
            })
        })
        .then(response => {
            document.getElementById('result').innerHTML = '连接成功！状态码: ' + response.status;
            return response.json();
        })
        .then(data => {
            document.getElementById('result').innerHTML += '<br>响应数据: ' + JSON.stringify(data);
        })
        .catch(error => {
            document.getElementById('result').innerHTML = '连接失败: ' + error.message;
        });
    }
    </script>
</body>
</html> 